import { _decorator, Component, Node, color, director, System, macro, size } from 'cc';
import { BaseManager } from '../libs/rxjs/cc3/BaseManager';
import { screen } from 'cc';
import { gm } from './GameManager';
import { udm } from './UserDataManager';
import { sys } from 'cc';
import { Size } from 'cc';
import { view } from 'cc';
import { ResolutionPolicy } from 'cc';
import { ReactiveProperty } from '../libs/rxjs/cc3/ReactiveProperty';
import { EDITOR } from 'cc/env';
import { StringTools } from '../libs/utils/StringTools';
const { ccclass, property } = _decorator;

let _designWidth = 1080;
let _designHeight = 2400;
if (StringTools.getValueInSearch('edit') == '1') {
    _designWidth = 1080;
    _designHeight = 1920;
}
export const DesignWidth = _designWidth;
export const DesignHeight = _designHeight;

if (!EDITOR) {
    if (StringTools.getValueInSearch('edit') == '1') {
        view.setDesignResolutionSize(DesignWidth, DesignHeight, ResolutionPolicy.SHOW_ALL);
    } else {
        view.setDesignResolutionSize(DesignWidth, DesignHeight, ResolutionPolicy.FIXED_WIDTH);
    }
}

const maximum = Math.max(screen.windowSize.width, screen.windowSize.height);
const minimum = Math.min(screen.windowSize.width, screen.windowSize.height);

@ccclass('ScreenManager')
export class ScreenManager extends BaseManager {

    public static instance: ScreenManager;
    static ID = 'screen_system';
    get logColorOverride() { return color().fromHEX('#DDEEDD') };

    static registerSystem() {
        director.unregisterSystem(director.getSystem(ScreenManager.ID));
        director.registerSystem(ScreenManager.ID, screenm, System.Priority.MEDIUM);
        screenm.init();
    }

    onInitManager() {
        this.log('onInitManager', this.timestamp);
        // Register event listeners with the screen object
        screen.on('window-resize', this.onWindowResize, this);
        screen.on('orientation-change', this.onOrientationChange, this);
        screen.on('fullscreen-change', this.onFullScreenChange, this);
    }

    onDestroyManager() {
        // Unregister event listeners when the component is destroyed
        screen.off('window-resize', this.onWindowResize, this);
        screen.off('orientation-change', this.onOrientationChange, this);
        screen.off('fullscreen-change', this.onFullScreenChange, this);
    }

    useObserves() {
        return [
            gm.fullScreenChangedCommand.subscribe(_ => {
                udm.fullScreenOn.value = screen.fullScreen();
                udm.save();
            }),
        ];
    }

    onWindowResize(width: number, height: number) {
        console.log("Window resized:", width, height);
        if (width > height) {
            this.currentDirection.value = 'landscape';
        } else {
            this.currentDirection.value = 'portrait';
        }
        gm.fullScreenChangedCommand.execute();
    }

    onOrientationChange(orientation: number) {
        if (orientation === macro.ORIENTATION_LANDSCAPE_LEFT || orientation === macro.ORIENTATION_LANDSCAPE_RIGHT) {
            console.log("Orientation changed to landscape:", orientation);
        } else {
            console.log("Orientation changed to portrait:", orientation);
        }
    }

    onFullScreenChange(width: number, height: number) {
        console.log("Fullscreen change:", width, height);
        gm.fullScreenChangedCommand.execute();
    }

    targetDirection: 'portrait' | 'landscape' = 'portrait'; // 竖屏0,横屏1
    currentDirection = ReactiveProperty.Create<'portrait' | 'landscape'>('portrait');

    landscape() {
        this.targetDirection = 'landscape';
        view.setDesignResolutionSize(DesignHeight, DesignWidth, ResolutionPolicy.SHOW_ALL);
        if (sys.isBrowser) {
            if (sys.isMobile) {
                view.resizeWithBrowserSize(true);
                view.setOrientation(macro.ORIENTATION_LANDSCAPE);
                let event = document.createEvent("HTMLEvents")
                event.initEvent("orientationchange", true, true)
                window.dispatchEvent(event)
            } else {
                screen.windowSize = new Size(maximum, minimum);
            }
        } else {
            // TODO: native 转横屏
        }
    }

    portrait() {
        this.targetDirection = 'portrait';
        view.setDesignResolutionSize(DesignWidth, DesignHeight, ResolutionPolicy.SHOW_ALL);
        if (sys.isBrowser) {
            if (sys.isMobile) {
                view.resizeWithBrowserSize(true);
                view.setOrientation(macro.ORIENTATION_PORTRAIT);
                let event = document.createEvent("HTMLEvents")
                event.initEvent("orientationchange", true, true)
                window.dispatchEvent(event)
            } else {
                screen.windowSize = new Size(minimum, maximum);
                view.setOrientation(macro.ORIENTATION_PORTRAIT);
            }
        } else {
            // TODO: native 转竖屏
        }
    }
}

globalThis.ScreenManager = ScreenManager;

export const screenm = ScreenManager.instance = new ScreenManager();